<%@ page contentType="text/html;charset=UTF-8" %>
<html>
<head>
    <title>添加书籍</title>
    <script src="${pageContext.request.contextPath}/static/js/jquery-3.5.1.min.js"></script>
    <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/static/css/header.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrap.min.css"/>
    <script src="${pageContext.request.contextPath}/static/bootstrap/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/vue/vue.min.js"></script>
</head>
<body>
<div class="all-classes-container">
    <div class="row ui-helper-clearfix">
        <div class="col-md-12 column">
            <div class="page-header">
                <h1>
                    <small>添加书籍</small>
                </h1>
            </div>
            <div class="col-md-4 column">
                <%--                <a class="btn btn-primary" href="${pageContext.request.contextPath}/admin/toadminAction">回到主页面</a>--%>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4 col-lg-4">
            <form action="#" method="post">
                <div class="form-group">
                    <label for="a1">书籍名称</label>
                    <input type="text" class="form-control" id="a1" autocomplete="off" required="required">
                </div>
                <div class="form-group">
                    <label for="a2">书籍作者</label>
                    <input type="text" class="form-control" id="a2" autocomplete="off" required>
                </div>
                <div class="form-group">
                    <label for="a3">书籍出版社</label>
                    <input type="text" class="form-control" id="a3" autocomplete="off" required>
                </div>
                <div class="form-group">
                    <label for="a4">书籍编号</label>
                    <input type="text" class="form-control" id="a4" autocomplete="off" required>
                </div>
                <div class="form-group">
                    <label for="a5">书籍分类</label>
                    <input type="text" class="form-control" id="a5" autocomplete="off" required>
                </div>
                <div class="form-group">
                    <label for="a6">书籍出版日期</label>
                    <input type="text" class="form-control" id="a6" autocomplete="off" required>
                </div>

            </form>
            <p>
                <btnt id="app" class="btn-success center-block" msg="添加"></btnt>
            </p>
        </div>
    </div>
</div>
<div
        class="modal fade"
        id="myModal"
        tabindex="-1"
        role="dialog"
        aria-labelledby="myModalLabel"
        aria-hidden="true"
>
    <div class="modal-dialog mid-center col-md-pull-1">
        <div class="modal-content">
            <div class="modal-header">
                <button
                        type="button"
                        class="close"
                        data-dismiss="modal"
                        aria-hidden="true"
                >
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">确认操作</h4>
            </div>
            <div class="modal-body">确认添加这本书吗</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">
                    关闭
                </button>
                <button id="a7" type="button" class="btn btn-primary" data-dismiss="modal">确认添加</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal -->
</div>
<script src="${pageContext.request.contextPath}/static/vue/btnt.js"></script>
<script>
    const reg1 = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/; //标准
    $("#a7").click(function () {
        if ($("#a1").val() === "" || $("#a2").val() === "" || $("#a3").val() === "" || $("#a4").val() === "" || $("#a5").val() === "" || $("#a6").val() === "") {
            alert("数据为空!");
            return;
        }
        if (!reg1.test($("#a6").val())) {
            alert("日期格式不正确，应为yyyy-MM-dd格式");
            return;
        }
        $.ajax({
            type: "post",
            url: "${pageContext.request.contextPath}/admin/addBook",
            data: {
                bookName: $("#a1").val(),
                bookAuthor: $("#a2").val(),
                bookConcern: $("#a3").val(),
                bookIsbn: $("#a4").val(),
                bookInfo: $("#a5").val(),
                bookDate: $("#a6").val()
            },
            dataType: "text",
            success: function (res) {
                alert(res);
            }, error: function (res) {
                alert(res)
            }
        });
    });
</script>
</body>
</html>
